import 'package:flutter/material.dart';
import 'package:flutter_hsh/fluttergromore/ads/ad_feed_view.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../../routes/app_pages.dart';
import 'jieqi_logic.dart';

/// 二十四节气页面
class JieqiPage extends StatefulWidget {
  const JieqiPage({Key? key}) : super(key: key);

  @override
  State<JieqiPage> createState() => _JieqiPageState();
}

class _JieqiPageState extends State<JieqiPage> {
  final JieqiLogic logic = Get.put(JieqiLogic());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SingleChildScrollView(
        controller: logic.scrollController,
        child: Container(
          color: const Color(0xFFAFE3FF), // 浅蓝色背景，与参考图片一致
          width: double.infinity,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              SizedBox(height: 40.h),
              // 标题
              Text(
                '二十四节气',
                style: TextStyle(
                  fontSize: 24.sp,
                  fontWeight: FontWeight.w500,
                  color: Colors.black,
                ),
              ),
              SizedBox(height: 30.h),
              // 四季卡片
              _buildSeasonGrid(),
              SizedBox(height: 10.h),
              const MyAdFeedView(),
              SizedBox(height: 10.h),
              // 小贴士
              _buildTipsCard(),
              SizedBox(height: 30.h),
            ],
          ),
        ),
      ),
    );
  }

  /// 构建四季网格
  Widget _buildSeasonGrid() {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 15.w),
      child: GridView.count(
        shrinkWrap: true,
        physics: const NeverScrollableScrollPhysics(),
        crossAxisCount: 2,
        mainAxisSpacing: 15.h,
        crossAxisSpacing: 15.w,
        childAspectRatio: 1.0,
        children: [
          _buildSeasonCard('春季', const Color(0xFF00A651), 'assets/images/spring_icon.svg'),
          _buildSeasonCard('夏季', const Color(0xFF00ABD4), 'assets/images/summer_icon.svg'),
          _buildSeasonCard('秋季', const Color(0xFFE4007F), 'assets/images/autumn_icon.svg'),
          _buildSeasonCard('冬季', const Color(0xFFFF6600), 'assets/images/winter_icon.svg'),
        ],
      ),
    );
  }

  /// 构建季节卡片
  Widget _buildSeasonCard(String title, Color color, String iconPath) {
    return GestureDetector(
      onTap: () {
        // 跳转到季节详情页面
        Get.toNamed(Routes.seasonDetail, arguments: {'seasonName': title});
      },
      child: Container(
        decoration: BoxDecoration(
          color: Colors.white.withOpacity(0.7),
          borderRadius: BorderRadius.circular(15.r),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
              width: 70.w,
              height: 70.w,
              decoration: BoxDecoration(
                color: color,
                shape: BoxShape.circle,
              ),
              child: Center(
                child: SvgPicture.asset(
                  iconPath,
                  width: 40.w,
                  height: 40.w,
                color: Colors.white,
              ),
            ),
          ),
          SizedBox(height: 15.h),
          Text(
            title,
            style: TextStyle(
              fontSize: 18.sp,
              fontWeight: FontWeight.bold,
              color: Colors.black87,
            ),
          ),
        ],
      ),
    )
    );
  }

  /// 构建小贴士卡片
  Widget _buildTipsCard() {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 15.w),
      padding: EdgeInsets.all(20.w),
      decoration: BoxDecoration(
        color: Colors.white.withOpacity(0.7),
        borderRadius: BorderRadius.circular(15.r),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '小贴士',
            style: TextStyle(
              fontSize: 18.sp,
              fontWeight: FontWeight.bold,
              color: Colors.black87,
            ),
          ),
          SizedBox(height: 10.h),
          Text(
            '各节气对应日期为公历大致范围(受年际差异略有浮动)。南北方气候差异显著，农事与习俗可据地而调。',
            style: TextStyle(
              fontSize: 14.sp,
              color: Colors.black54,
              height: 1.5,
            ),
          ),
        ],
      ),
    );
  }
}